<!--
 * @Author: FengTeng
 * @Date: 2021-02-12 08:55:04
 * @LastEditTime: 2021-03-03 11:10:59
 * @LastEditors: FengTeng
 * @Description: Description
 * @FilePath: \spa-manage\src\views\account\login\Login.vue
-->
<template>
  <div class="login">
    <div class="login-wrapper">
      <div class="login-image">
        <img :src="imageSrc" />
      </div>
      <div class="login-form">
        <div class="tips">
          <h3>欢迎登录</h3>
          <h3>Welcome to log on</h3>
        </div>
        <el-form :model="formData">
          <div class="sub-title">账号/account</div>
          <el-input v-model="formData.zhanghao" placeholder="请输入账号"></el-input>
          <div class="sub-title">密码/password</div>
          <el-input v-model="formData.pwd" placeholder="请输入密码" show-password></el-input>
          <div class="help-link">遇到问题请联系管理员</div>
          <el-button type="primary" @click="handleLogin()">登录/Login</el-button>
          <div class="login-message">{{ loginMessage }}</div>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import $ from "jquery";
import apis from "@/apis/index.js";
import { mapMutations } from "vuex";
import { SET_PEIMISSION_INFO, CLEAR_PEIMISSION_INFO } from "@/store/auth.permission.js";
import { SET_USER_INFO, CLEAR_USER_INFO } from "@/store/userinfo.js";
export default {
  name: "Login",
  data() {
    return {
      imageSrc: require("../../../assets/images/login-p1.jpg"),
      formData: {
        zhanghao: "admin",
        pwd: "123456"
      },
      loginMessage: ""
    };
  },
  methods: {
    ...mapMutations("permissionModule", {
      setPermission: SET_PEIMISSION_INFO,
      clearPermission: CLEAR_PEIMISSION_INFO
    }),
    ...mapMutations("authInfoModule", {
      setUserInfo: SET_USER_INFO,
      clearUserInfo: CLEAR_USER_INFO
    }),
    handleLogin() {
      console.log(this.formData);
      if (this.validateForm()) {
        this.loginMessage = "";
        let that = this;
        let permissions = {
          customerPool: {},
          memberManage: {},
          memberInfo: {},
          productsManage: {},
          systemManage: {}
        };
        let userInfo = {
          id: "",
          name: "",
          Phone: ""
        };
        // this.clearPermission();
        $.post(
          apis.LoginApi,
          {
            ...that.formData
          },
          resp => {
            resp = JSON.parse(resp);
            if (resp.code === "ok") {
              this.setUserPermissionMsg(permissions, resp.data.quanxian);
              this.setUserInfoMsg(userInfo, resp.data.user);
              this.setPermission(permissions);
              this.setUserInfo(userInfo);
              this.$router.push({
                path: "/main-menu/customer-pool/"
              });
            } else {
              this.$message.error(resp.msg);
            }
          }
        );
      } else {
        this.loginMessage = "请检查账号密码！";
      }
    },
    setUserPermissionMsg(permissions, pms) {
      permissions.customerPool.lookSearch = pms.yemianchakansousuo1;
      permissions.customerPool.createCustomer = pms.xinzengkehu;
      permissions.customerPool.setFollower = pms.shezhigenjinren;
      permissions.customerPool.setTransactionPercent = pms.shezhichenjiaozhishu;
      permissions.customerPool.addFollowLog = pms.tianjiagenjinjilu;
      permissions.customerPool.setSelectedProduct = pms.shezhichenjiaoshangping;
      permissions.memberManage.lookSearch = pms.yemianchakansousuo2;
      permissions.memberManage.useProduct = pms.shiyongfuwuceshu;
      permissions.memberInfo.lookSearch = pms.yemianchakansousuo3;
      permissions.memberInfo.createRule = pms.guizejianli;
      permissions.memberInfo.RuleShelf = pms.guizeshangjiaxiajia;
      permissions.productsManage.lookSearch = pms.yemianchakansousuo4;
      permissions.productsManage.guizeshangpin = pms.guizeshangping;
      permissions.productsManage.productShelf = pms.shangpingshangjiaxiajia;

      // 系统管理权限
      permissions.systemManage.lookSearch = true;
    },
    setUserInfoMsg(userInfo, user) {
      userInfo.id = user.id;
      userInfo.name = user.name;
      userInfo.username = user.zhanghao;
    },
    validateForm() {
      let flag = true;
      let that = this;
      Object.keys(that.formData).forEach(function(key) {
        if (that.formData[key].trim() === "") {
          flag = false;
        }
      });
      return flag;
    }
  }
};
</script>

<style lang="scss" src="./index.scss"></style>
